<#import "/resource/common_html_front.ftl" as html>
<#import "/indexMenu.ftl" as menu>
<@html.htmlBase>

<style type="text/css">
    img { border: none; }
    dl,dd,dt{
        margin: 0;
        padding: 0;
    }
    .container{
        margin:0 auto;
        width: 890px;
        border: 1px solid #ccc;
    }
    #header{
        width: 100%;
        height: 65px;
        line-height: 65px;
        margin-left: 20px;
    }
    #header span{
        font-size: 32px;
    }
    #header img{
        height: 40px;
        padding-top: 10px;
    }
    .info {
        width: 850px;
        height: 70px;
        padding: 20px;
        background-color: rgb(242,242,242);
        display: flex;
        flex-direction: row;
        justify-content: space-between;
    }
    .info .left{
        display: flex;
        flex-direction: column;
        justify-content: space-around;
    }
    .info .right{
        line-height: 70px;
    }

    .sm{
        width: 720px;
        border: 1px solid #000;
        border-radius: 10px;
        margin: 40px auto;
        padding-left:20px;
        padding-right:20px;
        padding-bottom: 20px;
    }
    .sm dl dt{
        height: 45px;
        line-height: 45px;
        border-bottom: 1px solid #f1f1f1;
    }
    .sm dl img{
        margin-top:20px;
        width: 155px;
    }
    .sm .view{
        margin-top: -40px;
        margin-left:auto;
        margin-right: auto;
        text-align: center;
    }
    .sm .view .ma img{
        width: 200px;
        height: 200px;
    }
    .sm .view img{
        width: 170px;
    }
</style>

	<@menu.menu selectMenu=""/>
<div class="container">
    <header id="header" class="">
        <img src="../resource/wxpayres/WePayLogo.png" alt="">
        <span>收银台</span>
    </header><!-- /header -->
    <div class="info">
        <div class="left">
            <div class="num">
                订单编号：<span id="orderId">${Request["orderId"]}</span>
            </div>
            <div class="type">
                订单名称：<span>${Request["name"]}</span>
            </div>
        </div>
        <div class="right">
            应付金额：<strong>${Request["money"]}元</strong>
        </div>
    </div>
    <div class="sm">
        <dl>
            <dt>微信支付</dt>
            <dd>
                <img src="../resource/wxpayres/WePayLogo.png" alt="微信Logo">
            </dd>
        </dl>
        <div class="view">
            <div class="ma">
                <img id="img_" src="${basepath}/paygate/wxPayCode?code=${Request["code"]}" alt="请扫描此处二维码">
            </div>
            <img src="../resource/wxpayres/listen.png" alt="说明文字">
        </div>
    </div>
</div>

<script type="text/javascript">
    $(document).ready(function(){
        setInterval(ajaxstatus, 3000);
    });
    function ajaxstatus() {
        $.ajax({
            url: "${basepath}/paygate/refreshPage",
            type: "POST",
            dataType: "json",
            data:{
                orderId:${Request["orderId"]}
            },
            success: function (data) {
                var dataObj = eval(data);
                if(dataObj.code == 0){
                    window.location.href = "${basepath}/paygate/toSuccess";
                }
            },
            error: function () {
                layer.msg("请求清单状态出错！");
            }
        });
    }


</script>

</@html.htmlBase>